<template>
    <div class="header">
        <ul>
            <li>&#xe61f;</li>
            <router-link tag="li" to="品类">品类</router-link>
            <!-- <li>品牌</li>   有两个以上子组件 的时候 就不用 加append -->
            <router-link tag="li" to="品牌">品牌</router-link>
            <li>&#xe64c;</li>
        </ul>
    </div>
</template>

<script>
export default {
  name: 'mallheader'
//   methods: {
//   }
}
</script>

<style lang="scss">
@font-face {
  font-family: 'iconfont';  /* project id 931790 */
  src: url('//at.alicdn.com/t/font_931790_ivslsra32n.eot');
  src: url('//at.alicdn.com/t/font_931790_ivslsra32n.eot?#iefix') format('embedded-opentype'),
  url('//at.alicdn.com/t/font_931790_ivslsra32n.woff') format('woff'),
  url('//at.alicdn.com/t/font_931790_ivslsra32n.ttf') format('truetype'),
  url('//at.alicdn.com/t/font_931790_ivslsra32n.svg#iconfont') format('svg');
}
.header{
    height: 52px;
    width: 100%;
    ul{
        width: 100%;
        height: 52px;
        display: flex;
        // vertical-align: center;
        text-align: center;
        // justify-content: between;
    li{
        flex: 1;
        float: left;
        // justify-content: center;
        height: 52px;
        line-height: 52px;
        &:nth-child(1){
            font-family: iconfont;
        };
        &:nth-child(4){
            font-family: iconfont;
        }
    }
}
}
</style>
